import 'package:flutter/material.dart';

class SingleChildScrollViewPage extends StatelessWidget {
  const SingleChildScrollViewPage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('滚动布局示例')),
      body: ListView(
        padding: const EdgeInsets.all(16),
        children: [
          _buildVerticalScrollDemo(),
          const SizedBox(height: 16),
          _buildHorizontalScrollDemo(),
          const SizedBox(height: 16),
          _buildNestedScrollDemo(),
        ],
      ),
    );
  }

  Widget _buildVerticalScrollDemo() {
    return Card(
      child: Padding(
        padding: const EdgeInsets.all(16),
        child: Column(
          children: [
            const Text('垂直滚动演示', style: TextStyle(fontSize: 16)),
            const SizedBox(height: 10),
            SizedBox(
              height: 200,
              child: SingleChildScrollView(
                child: Column(
                  children: List.generate(20, (index) => Text('列表项 $index')),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildHorizontalScrollDemo() {
    return Card(
      child: Padding(
        padding: const EdgeInsets.all(16),
        child: Column(
          children: [
            const Text('水平滚动演示', style: TextStyle(fontSize: 16)),
            const SizedBox(height: 10),
            SizedBox(
              height: 100,
              child: SingleChildScrollView(
                scrollDirection: Axis.horizontal,
                child: Row(
                  children: List.generate(
                    20,
                    (index) => Container(
                      width: 80,
                      margin: const EdgeInsets.only(right: 8),
                      color: Colors.blue[100],
                      alignment: Alignment.center,
                      child: Text('条目$index'),
                    ),
                  ),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildNestedScrollDemo() {
    return Card(
      child: Padding(
        padding: const EdgeInsets.all(16),
        child: Column(
          children: [
            const Text('嵌套滚动演示', style: TextStyle(fontSize: 16)),
            const SizedBox(height: 10),
            SizedBox(
              height: 200,
              child: SingleChildScrollView(
                child: Column(
                  children: [
                    ...List.generate(5, (index) => Text('外层列表项 $index')),
                    SizedBox(
                      height: 120,
                      child: SingleChildScrollView(
                        scrollDirection: Axis.horizontal,
                        child: Row(
                          children: List.generate(
                            10,
                            (index) => Container(
                              width: 100,
                              margin: const EdgeInsets.only(right: 8),
                              color: Colors.green[100],
                              alignment: Alignment.center,
                              child: Text('内层项$index'),
                            ),
                          ),
                        ),
                      ),
                    ),
                    ...List.generate(5, (index) => Text('外层列表项 ${index + 5}')),
                  ],
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}
